import 'package:flutter/material.dart';

class StepperTest2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new ListView(
        children: <Widget>[
          new StepperContents(),
          new StepperContents(),
          new StepperContents(),
          new StepperContents(),
          new SimpleWidget(),
        ],
      ),
    );
  }
}

class StepperContents extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Container(
      padding: new EdgeInsets.all(40.0),
      child: new Card(
        child: new Column(
          children: <Widget>[
            new Text(
                "Cards Content Cards ContentCards Content Cards Content Cards ContentCards Content Cards Content Cards Content "),
            new Text(
                "Cards Content Cards ContentCards Content Cards Content Cards ContentCards Content Cards Content Cards Content "),
            new Text(
                "Cards Content Cards ContentCards Content Cards Content Cards ContentCards Content Cards Content Cards Content "),
            new Text(
                "Cards Content Cards ContentCards Content Cards Content Cards ContentCards Content Cards Content Cards Content ")
          ],
        ),
      ),
    );
  }
}

class SimpleWidget extends StatefulWidget {
  @override
  SimpleWidgetState createState() => new SimpleWidgetState();
}

class SimpleWidgetState extends State<SimpleWidget> {
  int stepCounter = 0;
  List<Step> steps = [
    new Step(
      title: new Text("Step One"),
      content: new Text("This is the first step"),
      isActive: true,
    ),
    new Step(
      title: new Text("Step Two"),
      content: new Text("This is the second step"),
      isActive: true,
    ),
    new Step(
      title: new Text("Step Three"),
      content: new Wrap(
        spacing: 8.0, // gap between adjacent chips
        runSpacing: 4.0, // gap between lines
        direction: Axis.horizontal, // main axis (rows or columns)
        children: <Widget>[
          new Chip(label: new Text('Chips11')),
          new Chip(label: new Text('Chips12')),
          new Chip(label: new Text('Chips13')),
          new Chip(label: new Text('Chips14')),
          new Chip(label: new Text('Chips15')),
          new Chip(label: new Text('Chips16'))
        ],
      ),
      state: StepState.editing,
      isActive: true,
    ),
    new Step(
      title: new Text("Step Four"),
      content: new Text("This is the fourth step"),
      isActive: true,
    ),
  ];
  @override
  Widget build(BuildContext context) {
    return new Container(
      child: new Stepper(
        currentStep: this.stepCounter,
        steps: steps,
        type: StepperType.vertical,
        onStepTapped: (step) {
          setState(() {
            stepCounter = step;
          });
        },
        onStepCancel: () {
          setState(() {
            stepCounter > 0 ? stepCounter -= 1 : stepCounter = 0;
          });
        },
        onStepContinue: () {
          setState(() {
            stepCounter < steps.length - 1 ? stepCounter += 1 : stepCounter = 0;
          });
        },
      ),
    );
  }
}
